{extend name="layout/layout" /}

{block name="content"}
<div class="row">
    <div class="col-xs-12">
        <div class="box box-success">
            <div class="box-header with-border">
                <h3 class="box-title">设置</h3>
            </div>
            <div class="box-body">
                <form  class="form-horizontal form" method="post" enctype="multipart/form-data">
                    <div class="form-body">
                        <div class="row">
                            <div class="col-md-9">
                                <div class="form-group">
                                    <label class="control-label col-md-3">
                                        乡村名称
                                        <span class="required">*</span>
                                    </label>
                                    <div class="col-md-9">
                                        <input type="text" class="form-control" id="name" data-required="1" name="name" value="{$row.name}">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-9">
                                <div class="form-group">
                                    <label class="control-label col-md-3">
                                        图标
                                    </label>
                                    <div class="col-md-9">
                                        <div id="upload-image">
                                            <span id="upload-btn" data-multi="false">
                                                <input type="hidden" class="form-control" id="imgUrl"  name="imgUrl" value="{$row.imgUrl|default=''}">
                                                <img src="{$row.imgUrl|default='__STATIC__/admin/img/default.png'}" alt="图片上传" style="width: 100px;height: 100px;" />
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-9">
                                <div class="form-group">
                                    <label class="control-label col-md-3">
                                        联系电话<span class="required">*</span>
                                    </label>
                                    <div class="col-md-9">
                                        <input type="text" class="form-control" id="phone" data-required="1" name="phone" value="{$row.phone}">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-9">
                                <div class="form-group">
                                    <label class="control-label col-md-3">
                                        地址<span class="required">*</span>
                                    </label>
                                    <div class="col-md-9">
                                        <input type="text" id="address" value="{$row.address|default=''}" class="form-control input-large margin-bottom" name="address" placeholder="请输入详细地址，带省市">
                                        <input type="text" id="add-text1" style="display:none" value="" class="form-control input-large" name="addressGeo">
                                        <div style="width:100%;height:300px;" id="map_container"></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <hr />

                        <div class="form-actions">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label class="col-md-3 control-label"></label>
                                        <div class="col-md-9">
                                            <input type="hidden" name="id" value="{$row.id}">
                                            <button type="button" id="form-submit" class="btn btn-primary">
                                                保存 <i class="fa fa-floppy-o"></i>
                                            </button>
                                            <button type="button" class="btn btn-default" onclick="history.go(-1);">
                                                返回 <i class="fa fa-mail-forward"></i>
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<input type="hidden" class="token_url" value="{:url('admin/Image/token')}">
<input type="hidden" class="record_url" value="{:url('admin/Image/record')}">
<input type="hidden" class="delimage_url" value="{:url('admin/Image/delete')}">

{/block}

{block name="pagescript"}
<script src="__STATIC__/admin/js/qiniu/plupload.full.min.js" type="text/javascript"></script>
<script src="__STATIC__/admin/js/qiniu/qiniu.js" type="text/javascript"></script>
<script src="__STATIC__/admin/js/qiniu/custom.js" type="text/javascript"></script>
<script src="__STATIC__/admin/js/qiniu/qiniuConfig.js" type="text/javascript"></script>
<script src="__STATIC__/admin/js/uploadfile.js" type="text/javascript"></script>
<script src="https://api.map.baidu.com/api?v=2.0&ak=07E2669c3b77a0793274952ba61cd8b8&s=1" type="text/javascript"></script>
<script>

$(function() {  //初始化已有地址
    if($("#address").val() != ""){
        $("#address").blur();
    }

});

// 百度地图API功能
//创建Map实例
var map = new BMap.Map("map_container");
//初始化武汉坐标
var point = new BMap.Point(114.405492,30.502934);
var offsetY = 200;
//地图平移缩放控件：默认左上方
map.addControl(new BMap.NavigationControl());
//比例尺控件，默认位于地图左下方，显示地图的比例关系
map.addControl(new BMap.ScaleControl());
map.centerAndZoom(point,12);
//添加鼠标滚动缩放
map.enableScrollWheelZoom(true);
//设置标注的图标

//显示地址信息窗口
var marker = new BMap.Marker(point);
//把标注添加到地图上
map.addOverlay(marker);

//地址解析类
var gc = new BMap.Geocoder();
function showLocationInfo(pt, rs){
    var addComp = rs.addressComponents;
    $("#longitude").val(pt.lng);
    $("#latitude").val(pt.lat);
    console.log('经纬度：'+pt.lat+' '+pt.lng);
    $("#add-text1").val(pt.lat+','+pt.lng);
}

//删除标注
function deletePoint(){
    var allOverlay = map.getOverlays();
    for (var i = 0; i < allOverlay.length; i++){
        map.removeOverlay(allOverlay[i]);
    }
}

//根据选择框或输入框获取地址
var _area={
    //keyword:'',
    _address:$("#address"),
    unChecked:function(val){
        return (val==''||typeof (val)=='undefined'||val==null||
            val=='省份'||val=='地级市'||val=='市、县级市')?false:true;
    },
    list:function(){
        var _joinArea='';
        if(_area.unChecked(this._address.val())){
            _joinArea+=' '+this._address.val();
            //_joinArea=this._address.val();
        }
        return _joinArea;
    },
    init:function(){
        //绑定百度地图
        var _this=_area.list();
        //定义local
        var local = new BMap.LocalSearch(map, {
            renderOptions: {
                map: map,
                panel: "results",//结果容器id
                autoViewport: true,   //自动结果标注
                selectFirstResult: true  , //指定到第一个目标
                enableRouteSearchBox: true,
                enableRouteInfo:true
            },
            pageCapacity: 1
        });

        local.setSearchCompleteCallback(function (searchResult) {
            var poi = searchResult.getPoi(0);
            //document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat;
            map.centerAndZoom(poi.point, 12);
            gc.getLocation(poi.point, function(rs){
                showLocationInfo(poi.point, rs);
            });
        });
        local.search(_this);
    }
}

//全局变量：存储address字符串长度做判断
var _thisLength='';
$("#address").keydown(function(){
    _thisLength=$(this).val().length;
})
$("#address").keyup(function(){
    var _newLength=$(this).val().length;
    var timer=setTimeout(function(){
        if(_thisLength<=_newLength){
            deletePoint();
            _area.init();
        }
        else{
            clearTimeout(timer);
        }
    },1000);
})
$("#address").blur(function(){
    deletePoint();
    _area.init();
})




    var posturl = "{:url('admin/'.strtolower($model).'/editpost')}";
    $('#form-submit').on('click', function(){  //提交数据
        var form = this.form;
        if(form.name.value=='') {
            layer.msg('请输入名称');
            form.name.focus();
            return;
        }
        if(form.phone.value=='') {
            layer.msg("请填写联系电话");
            form.phone.focus();
            return;
        }
        var _data = $(form).serializeObject();
        $("#form-submit").attr("disabled","disabled");

        $.ajax({
            url : posturl,
            type : 'post',
            dataType : 'json',
            contentType : "application/json; charset=utf-8",
            data : JSON.stringify(_data),
        }).done(function(data) {
            if (data.code == 1) {
                layer.msg('保存成功');
                window.location.href= data.url; //加载页面数据
            } else if (data.code === 0 ) {  // 错误
                $("#form-submit").removeAttr("disabled");
                layer.msg(data.msg);
            }
        });
    });

</script>
{/block}